<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html" xmlns="http://www.w3.org/1999/html">
<head>
    <meta charset="UTF-8">
    <title>娱乐网站</title>
    <style type="text/css" media="screen">
        #music {
	width: 500px;
	height: 500px;
	border-radius: 10px;
	margin: 20px auto;
	position: relative;
	background: url(https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1545149319600&di=b1ec2d1c0aa00fa507eee88b75198133&imgtype=0&src=http%3A%2F%2Fwww.17qq.com%2Fimg_qqtouxiang%2F74841037.jpeg) no-repeat;
	background-size: cover;
	text-align: center;
}
#container {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	width: 500px;
	height: 500px;
	text-align: center;
	background:rgba(255,255,255,0.6);
}
#musicImg{
	width: 300px;
	height: 300px;
	text-align: center;
	margin: auto;
	border-radius:50%;

	}
a:link {color: #FF34B3} /* 未访问的链接 */
a:visited {color: #FF34B3} /* 已访问的链接 */
a:hover {color: #FFE4E1} /* 当有鼠标悬停在链接上 */
a:active {color: #0000FF} /* 被选择的链接 */
a.button {
    -webkit-appearance: button;
    -moz-appearance: button;
    appearance: button;
    text-decoration: none;
    color: green;
}
<form method="get" action="/page2">
    <button type="submit">Continue</button>
</form>
     <button onclick="window.location.href='/page2'"  >Continue</button>
<button onclick="location.href='http://www.example.com'" type="button"> www.example.com </button>
#mybtn{background-color:rgba(255,255,255,);
}
    </style>
        <script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>
  <!--小帅哥： https://unpkg.com/live2d-widget-model-chitose@1.0.5/assets/chitose.model.json-->
  <!--萌娘：https://unpkg.com/live2d-widget-model-shizuku@1.0.5/assets/shizuku.model.json-->
  <!--小可爱（女）：https://unpkg.com/live2d-widget-model-koharu@1.0.5/assets/koharu.model.json-->
  <!--小可爱（男）：https://unpkg.com/live2d-widget-model-haruto@1.0.5/assets/haruto.model.json-->
  <!--初音：https://unpkg.com/live2d-widget-model-miku@1.0.5/assets/miku.model.json-->
   <!-- 上边的不同链接显示的是不同的小人，这个可以根据需要来选择 下边的初始化部分，可以修改宽高来修改小人的大小，或者是鼠标移动到小人上的透明度，也可以修改小人在页面出现的位置

。 -->
  </script>
     <script>
    /*https://unpkg.com/live2d-widget-model-shizuku@1.0.5/assets/shizuku.model.json*/
    L2Dwidget.init({ "model": { jsonPath:
          "https://unpkg.com/live2d-widget-model-shizuku@1.0.5/assets/shizuku.model.json",
        "scale": 1 }, "display": { "position": "right", "width": 110, "height": 200,
        "hOffset": 10, "vOffset": -50 }, "mobile": { "show": true, "scale": 0.9 },
      "react": { "opacityDefault": 0.8, "opacityOnHover": 0.5 } });
  </script>

</head>
<img src="3.png"width="8%">
     <body background="10.jpg"
        style=" background-repeat:no-repeat ;
        background-size:100% 100%;
        background-color:rgba(255,255,255,);
        background-attachment: fixed;"></body>

     <br>
 <center>
     <font color="#FF6A6A">
     <h1>娱乐网站</h1>
     <h1>帅比的网站</h1>
         </font>
 </center>
     <hr>
     <br>
      <br>
      <br>
     <font color="#00FFFF">
     <h1> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;视频区&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;音乐区&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;游戏小说区</h1>
     </font>
     <table align="center">
    <tr>
          <td width="10%">

        </td>
        <td tyle="color:#FFB5C5" width="60">
                 <img src="1.jpg" width="200">
                <br><a href="a.html">
                    <button>红眼德岭</button>
</a>
              <img src="2.jpg" width="200">
                <br><a href="b.html">
                    <button>合集鬼畜视频</button>
</a>
        </td>

        <td width="75%">
<div id="music">
	<div id="container">
		<h3 id="musicName">音乐</h3>
		<img src="15.jpg" id="musicImg">
		<audio src="刘大壮 - 我不是你的宋冬野.mp3" autoplay="autoplay" loop="loop" controls="controls" id="audio" >low browsers not support</audio>
		<div class="btn">
			<button id="play">开始</button>
			<button id="pause">暂停</button>
			<button id="prev">上一首</button>
			<button id="next">下一首</button>
		</div>
	</div>
</div>
        </td>
        <td>
             <img src="OIP-C.jpg" width="300" height="300">
                 <br><a href="c.html">
                    <button>水果忍者</button>
</a>
        <br>
                        <img src="xiaowu.jpg" width="300" height="250">
                 <br><a href="斗罗大陆1.html">
                    <button>斗罗大陆小说</button>
</a>
        </td>
          <td width="20%">

        </td>
    </tr>
</table>


</body>
</html>
